<template>
	<view>
      <!-- 列表 -->
      <!-- 1 -->
      <view class="goods-list" >
        <view v-for="(item,i) in goodList" :key="i" @click="gotoDetail(item)">
          <!-- <my-goods :goods="item"></my-goods> -->
          <my-goods :goods="item"></my-goods>
         </view>
      </view>
	
  </view>
</template>

<script>
	export default {
		data() {
			return {
        // 请求参数
         queryObj:{
           query:'',
           cid:'',
           pagenum:1,
           pagesize:10
         } ,
         // 列表页数据
         goodList:[],
         // 总数量
         total:0,
         // 节流阀 避免同一时间多个请求发送
         isLoading:false
			};
		},
    // 进入页面时加载
    onLoad(options) {
      // console.log(options);
      this.queryObj.query = options.query||''
      this.queryObj.cid = options.cid||''
      // 获取列表页数据
      this.getGoodsList()
    },
    // 底部加载更多
    onReachBottom() {
      // 判断数据是否全部获取 全部获取后提示 不发送请求
      if(this.queryObj.pagenum*this.queryObj.pagesize>=this.total) return uni.$showMsg('数据加载完成')
      
      // 如果节流阀开着 不请求 停下来请求
      if(this.isLoading) return
      // 页面数据加一
      this.queryObj.pagenum+=1
      // 获取新列表页数据 
      this.getGoodsList()
    },
    // 上拉重新加载
    onPullDownRefresh() {
      // 重置关键数据
      this.queryObj.pagenum = 1
      this.total = 0
      this.goodList = []
      this.isLoading = false
      // 重新发请求 需要考虑关闭请求
      this.getGoodsList(()=>uni.stopPullDownRefresh())
    },
    // 方法
    methods:{
      // 获取列表页数据源
      async getGoodsList(cb){
        this.isLoading = true
        const {data:res} = await uni.$http.get('/api/public/v1/goods/search',this.queryObj)
        this.isLoading = false
        cb && cb()
        if(res.meta.status!==200) return uni.$showMsg()
        // console.log(res);
        // 新旧数据放一起
        this.goodList = [...this.goodList,...res.message.goods]
        this.total = res.message.total
      },
      // 点击跳转
      gotoDetail(item){
        uni.navigateTo({
          url:'/subpkg/goods_detail/goods_detail?goods_id='+item.goods_id
        })
      }
    }
	}
</script>

<style lang="scss">
  
</style>
